<include file="public@header" />
<link rel="stylesheet" href="__STATIC__/layui/css/layui.css">
</head>
<body>
	<div class="wrap">
		<ul class="nav nav-tabs">
			<li ><a href="{:url('user/adminIndex/index')}">本站用户</a></li>
			<li class="active"><a >添加主播</a></li>
		</ul>
		<form method="post" class="form-horizontal js-ajax-form margin-top-20" action="{:url('user/adminIndex/addPost')}">

            <div class="form-group">
				<label for="input-user_login" class="col-sm-2 control-label"><span class="form-required">*</span>手机号</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-user_login" name="user_login">
				</div>
			</div>
            
            <!-- <div class="form-group">
				<label for="input-user_pass" class="col-sm-2 control-label"><span class="form-required">*</span>密码</label>
				<div class="col-md-6 col-sm-10">
					<input type="password" class="form-control" id="input-user_pass" name="user_pass">
				</div>
			</div> -->
            
            <div class="form-group">
				<label for="input-user_nickname" class="col-sm-2 control-label"><span class="form-required">*</span>昵称</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-user_nickname" name="user_nickname" maxlength="7">
					<p class="help-block">最多7个字</p>
				</div>
			</div>
            
            <div class="form-group">
				<label for="input-sex" class="col-sm-2 control-label"><span class="form-required">*</span>性别</label>
				<div class="col-md-6 col-sm-10">
					<label class="radio-inline"><input type="radio" name="sex" value="1" checked>男</label>
					<label class="radio-inline"><input type="radio" name="sex" value="2" >女</label>
				</div>
			</div>

			<div class="form-group">
				<label for="input-thumbnail" class="col-sm-2 control-label">头像</label>
				<div class="col-md-6 col-sm-10">
					<input type="hidden" name="avatar" id="thumbnail" value="">
                    <a href="javascript:uploadOneImage('图片上传','#thumbnail');">
                        <img src="__TMPL__/public/assets/images/default-thumbnail.png"
                                 id="thumbnail-preview"
                                 style="cursor: pointer;max-width:100px;max-height:100px;"/>
                    </a>
                    <input type="button" class="btn btn-sm btn-cancel-thumbnail" value="取消图片"> 建议尺寸： 300 X 300
				</div>
			</div>

			<div class="form-group" id="">
				<label for="input-thumbnail2" class="col-sm-2 control-label">头像小图</label>
				<div class="col-md-6 col-sm-10">
                    <input type="hidden" name="avatar_thumb" id="thumbnail2" value="">
                    <a href="javascript:uploadOneImage('图片上传','#thumbnail2');">
                        <img src="__TMPL__/public/assets/images/default-thumbnail.png"
                                 id="thumbnail2-preview"
                                 style="cursor: pointer;max-width:100px;max-height:100px;"/>
                    </a>
                    <input type="button" class="btn btn-sm btn-cancel-thumbnail2" value="取消图片"> 建议尺寸： 100 X 100  分享用
				</div>
			</div>

			<div class="form-group">
				<label for="input-swftime" class="col-sm-2 control-label"><span class="form-required">*</span>个性签名</label>
				<div class="col-md-6 col-sm-10">
					<textarea class="form-control" id="input-signature" name="signature" maxlength="40" placeholder="40字以内"></textarea> 
				</div>
			</div>

			<div class="form-group" id="">
				<label for="input-thumbnail3" class="col-sm-2 control-label"><span class="form-required">*</span>封面</label>
				<div class="col-md-6 col-sm-10">
                    <input type="hidden" name="thumb" id="thumbnail3" value="">
                    <a href="javascript:uploadOneImage('图片上传','#thumbnail3');">
                        <img src="__TMPL__/public/assets/images/default-thumbnail.png"
                                 id="thumbnail3-preview"
                                 style="cursor: pointer;max-width:100px;max-height:100px;"/>
                    </a>
                    <input type="button" class="btn btn-sm btn-cancel-thumbnail3" value="取消图片">
				</div>
			</div>

			<div class="form-group" id="">
				<label for="input-thumbnail4" class="col-sm-2 control-label"><span class="form-required">*</span>背景墙</label>
				<div class="col-md-6 col-sm-10">
                    <input type="hidden" name="photos" id="thumbnail4" value="">
                    <a href="javascript:uploadOneImage('图片上传','#thumbnail4');">
                        <img src="__TMPL__/public/assets/images/default-thumbnail.png"
                                 id="thumbnail4-preview"
                                 style="cursor: pointer;max-width:100px;max-height:100px;"/>
                    </a>
                    <input type="button" class="btn btn-sm btn-cancel-thumbnail4" value="取消图片">
				</div>
			</div>

			<div class="form-group">
				<label for="input-thumbnail5" class="col-sm-2 control-label"><span class="form-required">*</span>个人介绍视频封面</label>
				<div class="col-md-6 col-sm-10">
					<input type="hidden" name="video_thumb" id="thumbnail5" value="">
                    <a href="javascript:uploadOneImage('图片上传','#thumbnail5');">
                        <img src="__TMPL__/public/assets/images/default-thumbnail.png"
                                 id="thumbnail5-preview"
                                 style="cursor: pointer;max-width:100px;max-height:100px;"/>
                    </a>
                    <input type="button" class="btn btn-sm btn-cancel-thumbnail5" value="取消图片">
				</div>
			</div>

			<div class="form-group">
				<label for="input-video" class="col-sm-2 control-label"><span class="form-required">*</span>上传视频</label>
				<div class="col-md-6 col-sm-10">
					<input class="form-control" id="js-file-input" type="text" name="video" style="width: 300px;display: inline-block;" title="视频文件地址" >

                    <a href="javascript:uploadOne('文件上传','#js-file-input','video');" style="color:#18BC9C;">上传文件</a>MP4格式
                   	<p class="help-block">可填写视频链接 [只能包含字母,数字,下划线,不能包含*#$等特殊字符]，可直接上传视频获取链接</p> 
				</div>
				
			</div>

			<div class="form-group">
				<label for="input-username" class="col-sm-2 control-label"><span class="form-required">*</span>姓名</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-username" name="username" maxlength="6" placeholder="6字以内" value="">
				</div>
			</div>

			<div class="form-group">
				<label for="input-cardno" class="col-sm-2 control-label"><span class="form-required">*</span>身份证号</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-cardno" name="cardno" maxlength="20" value="">
				</div>
			</div>

			<div class="form-group">
				<label for="input-height" class="col-sm-2 control-label"><span class="form-required">*</span>身高</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-height" name="height"  placeholder="请输入身高cm">
				</div>
			</div>

			<div class="form-group">
				<label for="input-weight" class="col-sm-2 control-label"><span class="form-required">*</span>体重</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="input-weight" name="weight"  placeholder="请输入体重kg">
				</div>
			</div>

			<div class="form-group">
                <label for="input-family_switch" class="col-sm-2 control-label"><span class="form-required">*</span>星座</label>
                <div class="col-md-6 col-sm-10">
                    <select class="form-control" name="constellation">
                        <option value="白羊座">白羊座(3.21-4.19)</option>
                        <option value="金牛座">金牛座(4.20-5.20)</option>
                        <option value="双子座">双子座(5.21-6.21)</option>
                        <option value="巨蟹座">巨蟹座(6.22-7.22)</option>
                        <option value="狮子座">狮子座(7.23-8.22)</option>
                        <option value="处女座">处女座(8.23-9.22)</option>
                        <option value="天秤座">天秤座(9.23-10.23)</option>
                        <option value="天蝎座">天蝎座(10.24-11.22)</option>
                        <option value="射手座">射手座(11.23-12.21)</option>
                        <option value="摩羯座">摩羯座(12.22-1.19)</option>
                        <option value="水瓶座">水瓶座(1.20-2.18)</option>
                        <option value="双鱼座">双鱼座(2.19-3.20)</option>
                    </select>
                </div>
            </div>

            <div class="form-group">
				<label for="input-label" class="col-sm-2 control-label"><span class="form-required">*</span>形象标签</label>
				<div class="col-md-6 col-sm-10">
					<volist name="label_list" id="vo">
						<label class="checkbox-inline"><input type="checkbox" value="{$vo['id']}" name="label[]"><span style="color: {$vo['colour']}">{$vo['name']}</span></label>
					</volist>
					<p class="help-block">至多选3项</p>
				</div>
			</div>

			<div class="form-group">
				<label for="input-intr" class="col-sm-2 control-label"><span class="form-required">*</span>个人介绍</label>
				<div class="col-md-6 col-sm-10">
					<textarea class="form-control" id="input-intr" name="intr" maxlength="40" placeholder="40字以内"></textarea> 
				</div>
			</div>

			<div class="form-group">
				<label for="input-name" class="col-sm-2 control-label"><span class="form-required">*</span>所在城市</label>
				<div class="col-md-6 col-sm-10">
                    <div class="layui-form">
				        <div class="layui-form-item" id="receive_area-picker">
				            
				            <div class="layui-input-inline" style="width: 200px;">
				                <select name="province" class="province-selector" data-value="" lay-filter="province-1">
				                    <option value="">请选择省</option>
				                </select>
				            </div>
				            <div class="layui-input-inline" style="width: 200px;">
				                <select name="city" class="city-selector" data-value="" lay-filter="city-1">
				                    <option value="">请选择市</option>
				                </select>
				            </div>
				            <div class="layui-input-inline" style="width: 200px;">
				                <select name="district" class="county-selector" data-value="" lay-filter="county-1">
				                    <option value="">请选择区</option>
				                </select>
				            </div>
				        </div>
				    </div>
				</div>
			</div>
            
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn btn-primary js-ajax-submit">{:lang('ADD')}</button>
					<a class="btn btn-default" href="javascript:history.back(-1);">{:lang('BACK')}</a>
				</div>
			</div>
            
		</form>
	</div>
	<script src="__STATIC__/js/admin.js"></script>
	<script src="__STATIC__/layui/layui.js"></script>
    <script>
        //配置插件目录
        layui.config({
            base: '__STATIC__/mods/'
            , version: '1.0'
        });
        //一般直接写在一个js文件中
        

        layui.use(['layer', 'form', 'layarea'], function () {
            var layer = layui.layer
                , form = layui.form
                , layarea = layui.layarea;

            layarea.render({
                elem: '#receive_area-picker',
                change: function (res) {
                    //选择结果
                    console.log(res);
                }
            });

        });

        
    </script>
	<script>
        (function(){
            $('.btn-cancel-thumbnail').click(function () {
                $('#thumbnail-preview').attr('src', '__TMPL__/public/assets/images/default-thumbnail.png');
                $('#thumbnail').val('');
            });
            
            $('.btn-cancel-thumbnail2').click(function () {
                $('#thumbnail2-preview').attr('src', '__TMPL__/public/assets/images/default-thumbnail.png');
                $('#thumbnail2').val('');
            });

            $('.btn-cancel-thumbnail3').click(function () {
                $('#thumbnail3-preview').attr('src', '__TMPL__/public/assets/images/default-thumbnail.png');
                $('#thumbnail3').val('');
            });
            $('.btn-cancel-thumbnail4').click(function () {
                $('#thumbnail4-preview').attr('src', '__TMPL__/public/assets/images/default-thumbnail.png');
                $('#thumbnail4').val('');
            });
            $('.btn-cancel-thumbnail5').click(function () {
                $('#thumbnail5-preview').attr('src', '__TMPL__/public/assets/images/default-thumbnail.png');
                $('#thumbnail5').val('');
            });


        })()
    </script>
</body>
</html>